<template>
	<view>
		<!--  -->
		<view @click="addCount">
			{{count}}
		</view>
		<!-- v-for循环渲染 -->
		<view class="item" v-for="(item,index) in nameArr" :key="item.id">
				{{index}}--{{item.name}}
		</view>
		
		<!-- 使用组件 -->
		<mychild :userinfo='userinfo' @myevent='getvalue'></mychild>
		<view class="">
			我想对你说--{{word}}
		</view>
		
		<!-- 跳转页面 -->
		<button @click="gotopageFn">跳转页面</button>
	</view>
</template>

<script>
	//在 uniapp 单文件组件中, 组件的生命周期 包含 vue组件的生命周期和 小程序的生命周期, 开发者都可以使用.
	//注意: 在uniapp中可以直接在父组件中使用子组件, 而无需导入注册
	
	const app = getApp();
	// 导入组件
	// import mychild from '../../components/mychild/mychild.vue';
	
	export default {
		// components:{
		// 	mychild
		// },
		data() {
			return {
				count: 100,
				word:'',
				nameArr: [{
						id: 1,
						name: "jim"
					},
					{
						id: 2,
						name: "lily"
					},
					{
						id: 3,
						name: "hanmeimei"
					}
				],
				userinfo:{
					username:'白振宁',
					age:18
				}
			}
		},
		onLoad() {
			 console.log('onload')
			 console.log('app',app);
			 console.log(app.globalData.girlArr);
			 
			 
		},
		onShow() {
			 console.log('onShow')
		},
		onHide() {
			console.log('onHide');
		},
		created(){
			console.log('created');
		},
		mounted(){
			console.log('mounted');
		},
		destroyed() {
			console.log('destroyed');
		},
		methods: {
			addCount() {
				console.log('this', this)
				this.count++
				
			},
			getvalue(data){
				console.log(data);
				this.word = data
			},
			gotopageFn(){
				uni.navigateTo({
					url:'/pages/detail/detail?id=999'
				})
			}
		}
	}
</script>

<style scoped>
	.item{
		background-color: aqua;
	}
	
</style>
